#include ("/_includes/_layout.html")
#define css()
<style type="text/css">
.nav-tabs li{width:100px;}
.nav-tabs li a{text-align: center;}
</style>
#end
#@layout("商品管理", "wxmall,点步科技", "Wxmall社区","wxmall") 
#define content()
<div class="wrapper wrapper-content">
	<div class="content-tabs">
        <nav class="page-tabs J_menuTabs">
        	<div class="page-tabs-content" style="margin-left: 0px;">
        	<a href="#(webctx)/product" class="J_menuTab active">出售中</a>
        	<a href="#(webctx)/product/shouqin" class="J_menuTab">已售罄</a>
            <a href="#(webctx)/product/warehouseIndex" class="J_menuTab">仓库中</a>
        	</div>
        </nav>
    </div>
	<div id="tableList" class="ibox-content">
		<div id="productToolsbar" class="panel-body">
			<div style="float: left; margin-right: 20px;">
			<a href="#(webctx)/product/add" class="btn btn-success">发布商品</a></div>
			<select id="p_category" class="control-inline" >
				<option value="">全部</option>
	            #for (productCategory: productCategory)
	               <option value="#(productCategory.id)">#(productCategory.name)</option>
	            #end  
	        </select> &nbsp;&nbsp;
			      商品：<input id="p_name" type="text"  class="control-inline"/>&nbsp;&nbsp;
			<button id="myqueryBtn" class="btn btn-success btn-sm">查询</button>
			<!-- <div style="float: left; margin-right: 20px;"><a href="#(webctx)/product/add" class="btn btn-success">商品导入</a></div> -->
			<div id="pager" class="jqpager" style="margin-bottom: 1px;float: right;"></div>
		</div>
		
		<div class="alert alert-warning">使用微信打开此地址即可访问商城效果=====》http://#(session.weapp_in_session.app_id??).dbumama.com</div>
		
		<table class="table table-striped table-bordered" id="mainTable" border="0">
			<thead>
				<tr>
					<th><input type="checkbox" id="all" title="全选/反选" style="margin-right: 4px; vertical-align: middle;"/></th>
					<th><span style="vertical-align: middle;">&nbsp;&nbsp;商品</span></th>
					<th>价格</th>
					<th>库存</th>
					<th>创建时间</th>
					<th>销量</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody class="productLotGrid"></tbody>
		</table>
		</div>
</div>

<script type="text/template" id="product_table_tr_tpl">
{{each list as item i}}
		<tr class="package">
			<td><input type="checkbox" class="commchk" id="checkbox_{{item.id}}" style="margin-right: 4px; vertical-align: middle;"/></td>
			<td>
			<img width="40" height="40" src="{{item.img}}"><a class="new-window" href="javascript:void(0)" title="{{item.name}}">&nbsp;{{item.name}}</a></img>
			</td>
			<td><span class="label label-success">￥{{item.price}}</span></td>
            <td>{{item.stock}}</td>
            <td><span>{{item.startDate}}</span></td>
            <td>{{item.sales}}</td>
			<td>&nbsp;<a id="edit#{{item.id}}" href="javascript:void(0)">编辑</a>
				&nbsp;<a id="del#{{item.id}}" href="javascript:void(0)">下架</a>
			</td>
		</tr>
{{/each}}
</script>
<script type="text/template" id="table_noresult_tr_tpl">
	<tr class="package">
			<td class="center" colspan="7">
				没有商品，现在发布吧，
				<a href="#(webctx)/product/add" style="text-decoration: underline;">去发布</a>
			</td>
		</tr>
</script>
#end
<script type="text/javascript">
var params = {};
var table = new obz.TableView("pager", obz.ctx + "/product/list", params, function(resp){
	$(".productLotGrid").empty();
	if(resp && resp.list && resp.list.length>0){
		$('.productLotGrid').html(template('product_table_tr_tpl', resp));

		//初始化checkbox点击事件
		TBatch.checkCheckbox();
		TBatch.initCheckboxClick();
		TBatch.initOptEvent(TableOpt.init());
	}else{
		$(".productLotGrid").append($("#table_noresult_tr_tpl").html());
	}
});
table.init();

$("#myqueryBtn").click(function(){
	params.categoryId = $("#p_category").val();
	params.name = $("#p_name").val();
	table.init();
});

//=============================表格操作事件开始=============================================
var TableOpt = {
	edit : function(param){
		var id = param[1];
		location.href = obz.ctx + "/product/edit/"+id;
	}, 
	
	del : function(param){
		obz.showMessage("确定下架吗？", function(){
			var ids = param[1];
    		obz.ajaxJson(obz.ctx + "/product/offShelve", {ids: ids}, function(resp){
    			if(resp.code==200){
    				table.init();
    			}
    		});
		});
		return false;
	},
	
	init : function(){
		var optArray = new Array();
		optArray.push(this.edit);
		optArray.push(this.del);
		return optArray;
	}
}	
//=============================表格操作事件结束=============================================
</script>